<script setup lang="ts"></script>

<template>
  <div class="goods-item">
    <div class="bottom">找相似</div>
  </div>
</template>

<style scoped lang="scss">
.goods-item {
  width: 70px;
  height: 60px;
  background-color: #ccc;
  position: relative;
  overflow: hidden;

  .bottom {
    transition: all 0.3s;
    position: absolute;
    bottom: -65px;
    background-color: #27ba9b;
    font-size: 12px;
    width: 100%;
    text-align: center;
    color: #fff;
  }
  &:hover {
    border: 1px solid #27ba9b;
    .bottom {
      bottom: 0px;
    }
  }
}
</style>
